<ion-header class="hc-header light">
  
    <a href="javascript:;" (click)="gotoMap()">Map</a>
    <span class="hc-header-search">
        <label class="iconfont icon-home_search"></label>
        <input type="search" placeholder="Address or Postcode...">
      </span>
    <a href="javascript:;">Filter</a>
    <a href="javascript:;">Post</a>
</ion-header>

<ion-content class="hc-content">
  <div class="nav-map">
    <span>Buy</span>
    <span>Rent</span>
    <span>Rent per day</span>
    <span>Service</span>
  </div>
  <div class="nav-mask"></div>
  <div class="list-content">
    <div class="house" *ngFor="let house of list">
      <div class="house_content">
        <div class="house_img" [ngStyle]="house.img"><a class="iconfont icon-list_heartsvg"></a></div>
        <div class="house_info">
          <p><i class="iconfont icon-map_map"></i><font>{{house.title}}</font></p>
          <p> 
            <label for=""> <i class="iconfont icon-detail_sofa"></i><font>{{house.sofa}}</font> </label>
            <label for=""> <i class="iconfont icon-detail_bed"></i><font>{{house.bed}}</font> </label>
            <label for=""> <i class="iconfont icon-bad"></i><font>{{house.shower}}</font> </label>
            <label for=""> <font>{{house.area}}</font> </label>
          </p>
          <p>
            <font>{{house.type}}</font>
            <span>{{house.price}}</span>
          </p>
        </div>
      </div>
    </div>
  </div>
  <div class="save_search">
    <a href="javascript:;">Sort</a>
    <a href="javascript:;">Save Search</a>
  </div>
</ion-content>
